Расширение TYPO3 — Teaser

Давно искал простое, но рабочее расширение с легко настраиваемым внешним видом с использованием CSS, которое будет работать в качестве карты сайта, но выводить нужные мне поля из параметров страницы. Как то: заданное изображение, заголовок и короткий текст, забитый в поля, предназначенные для мета-описаний страницы. После долгих поисков оно нашлось. Называется просто Teaser (ключ для поиска: bf_teaser).

Процедура установки Teaser на TYPO3 сайт следующая:

  1. Устанавливаем bf_teaser из меню репозитория;
  2. Прописываем в свойствах страниц соответствующие поля (см. ниже);
  3. Добавляем на нужную корневую страницу элемент контента «Карта сайта», в настройках которого, в блоке «Меню и карта сайта» ищем настройку «Тип меню» и изменяем значение по умолчанию на Teaser;
  4. В поле ниже с названием «Выбранные страницы» добавляем нужные нам страницы, из которых будет строиться тизерное меню.
  5. Profit!

В шаблоне по умолчанию, построенном на основе таблицы, поля выводятся в следующем порядке:

  1. Слева в столбце картинка, определенная во вкладке «Ресурсы» свойств страницы;
  2. Справа в столбце: «Заголовок страницы» свойств страницы;
  3. Ниже поле «Подзаголовок» свойств страницы;
  4. И последним поле «Аннотация: внутреннее использование для резюме и меню» на вкладке «Метаданные» в тех же свойствах страницы.

CSS-стили, которые определены в дефолтном TypoScript и используются для отображения тизерного меню:

.tx-bfteaser-pi1 { font-family:Arial, Helvetica, sans-serif; color:#333333; background:#FFFFFF; background-color:transparent; margin:0px; line-height:16px; }
.tx-bfteaser-pi1 H1 { font-weight:bold; font-size:14px; }
.tx-bfteaser-pi1 H2 { font-size:14px; }
.tx-bfteaser-pi1 P { font-size:12px; }
.tx-bfteaser-pi1 A:link { color:#000000; text-decoration:none; border-bottom:1px dotted #FFB200; background-color:transparent;}
.tx-bfteaser-pi1 A:hover { color:#FFFFFF; text-decoration:none; background-color:#FFB200;}
.tx-bfteaser-pi1 A:visited { color:#000000; text-decoration:none; border-bottom:1px dotted #FFB200; background-color:transparent;}
.tx-bfteaser-pi1 td { padding:5px; }

Все они, как вы понимаете, с успехом переопределяются в основном файле стилей вашего шаблона. Причем, так как некоторые атрибуты (типа border-bottom) уже определены, их нужно не просто стереть из определения, а именно переопределить: например {border: 0px;}.

Добавить комментарий

Ваш адрес email не будет опубликован.

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.